<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>行内元素</title>
	</head>
	<style>
		input {
			width: 249px;
		}
	</style>
	<body>
		<!-- 常见的行内元素有 a, strong, b, em, i, del,s, ins, u, span -->
		<!-- 其中span标签是最典型的行内元素, 行内元素也称为: 内联元素 -->
		<!-- 行内元素的特点: -->
			<!-- 1.相邻行内 元素在一行上, 一行可以显示多个 -->
			<!-- 2.高,宽直接设置它本身内容的宽度 -->
			<!-- 3.默认宽度就是它本身内容的宽度 -->
			<!-- 4.行内元素只能容纳文本或其他行内元素 -->
		<!-- 注意: -->
			<!-- 链接里面不能再放入链接 -->
			<!-- 特殊情况链接a里面可以放块级元素, 但是a转换一下块模式最安全 -->
		
		
		
		<!-- 行内元素有几个特殊标签: -->
		<!-- img, input, td 他们同时具备有块元素和行内元素的特点, 也称为行内块元素 -->
		<!-- 行内块元素的特点:	 -->
			<!-- 1.和相邻行内元素(行内块)在一行上, 但是他们之间会有空白缝隙, 一行可以显示多个(行内元素特点) -->
			<!-- 2.默认宽度就是他本身内容的宽度(行内元素特点) -->
			<!-- 3.高度, 行高, 外边距以及内边距都可以控制(块级元素特点 -->
			<input type="text">
			<input type="text">
			
			<table border="1" cellspacing="0">
				<tr><th>元素模式</th><th>元素排列</th><th>设置样式</th><th>默认宽度</th><th>包含</th></tr>
				<tr><td>块级元素</td><td>一行只能放一个块级元素</td><td>可以设置宽高</td><td>容器的100%</td><td>容器级可以包含任何标签</td></tr>
				<tr><td>行内元素</td><td>一行可以放多个行内元素</td><td>不可设置宽高</td><td>它本身内容的宽度</td><td>容纳文本或者其他行内元素</td></tr>
				<tr><td>行内元素</td><td>一行放多个行内块元素</td><td>可以设置宽度和高度</td><td>他本身的内容和宽度</td><td></td></tr>
			</table>
	</body>
</html>
